<template>
        <!-- 底部按钮保存区域 -->
        <div class="footer-btns" @click="footerClick">
            <span>信息保存</span>
        </div>
</template>
  
<script setup>
import { ref, reactive, toRefs } from 'vue';
const emit = defineEmits(["callBackEvent"]);
const footerClick = () =>{
    emit("callBackEvent")
}

</script>

<style scoped>
        .footer-btns {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            position:fixed;
            bottom: 0;
            height: 80px;
            width: 100%;
            background-color: #f5f8fa;
            border-radius: 20px 20px 0  0;

            span {
                font-size: 26px;
                color: #fff;
                font-weight: 600;
                background-color: #3eafe0;
                padding: 8px 12px;
                border-radius: 10px;
                margin-right: 18px;
            }
        }

</style>